<template>
    <div class="swiper-container slider">
        <div class="swiper-wrapper">
            <div class="swiper-slide" v-for="item in lunboList">
                <a :href="item.url">
                    <img :src="item.imageUrl" alt="">
                </a>
            </div>
        </div>
    </div>
</template>

<script>

    import $ from 'jquery';
    import Swiper from 'swiper';

    export default {
        data: function() {
            return {
                lunboList: []
            }
        },
        mounted: function() {
            var url = 'http://localhost:3000/lunbo?time=' + new Date().getTime();
            var that = this;
            $.get(url, function(res) {
                that.lunboList = res.data.billboards;
                that.$nextTick(function() {
                    new Swiper('.slider', {
                        loop: true,
                        autoplay: 3000,
                        autoplayDisableOnInteraction: false
                    })
                })
            })
        }
    }    
</script>
